import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { saveFormData, clearData, changeData } from '../../store/home/action';
import { connect } from 'react-redux';
import './counter.less'
class Counter extends Component {
    static propTypes = {
        formData: PropTypes.object.isRequired,
        saveFormData: PropTypes.func.isRequired
    }

    onIncreaseClick = () => {
        this.props.saveFormData({ name: '111', age: 16 })
    }
    clear = () => {
        this.props.changeData({ name: '111' })
    }
    componentDidMount() {

    }
    render() {
        return (
            <div>
                <span className="font" onClick={this.clear}>{this.props.formData.name}</span>
                <span className="font" >{this.props.editorData.name}+{this.props.formData.age}</span>
                <button onClick={this.onIncreaseClick}>Increase</button>
            </div>
        )
    }
}
export default connect(state => ({
    formData: state.formData,
    editorData: state.editorData
}), {
    saveFormData,
    clearData,
    changeData
})(Counter);